<!DOCTYPE html>
<!--suppress ALL-->
<html lang="en" xmlns:v-on="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"
      xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity3">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0, user-scalable=0">

    <title>个人资料</title>

    <link href="/static/yonghu/AmazeUI-2.4.2.assets.css/admin.css" rel="stylesheet" type="text/css">
    <link href="https://cdn.bootcss.com/amazeui/2.5.1/css/amazeui.css" rel="stylesheet" type="text/css"/>

    <link href="/static/yonghu/css/personal.css" rel="stylesheet" type="text/css">
    <link href="/static/yonghu/css/infstyle.css" rel="stylesheet" type="text/css">
    <script type="text/javascript" th:src="@{/static/lib/jquery/1.9.1/jquery.min.js}"></script>
    <script src="/static/yonghu/AmazeUI-2.4.2/assets/js/amazeui.js" type="text/javascript"></script>
    <script type="text/javascript" th:src="@{/static/lib/layer/2.4/layer.js}"></script>

</head>

<body>
<!--头 -->
<header>
    <article>
        <div class="mt-logo">
            <!--顶部导航条 -->
            <div class="header-top">
                <div class="am-container header">
                    <ul class="message-r">

                    </ul>
                </div>
            </div>

            <div class="clear"></div>
        </div>
        </div>
    </article>
</header>
<div class="nav-table">
    <div class="long-title"><span class="all-goods">我的个人中心</span></div>
    <div class="nav-cont">
    </div>
</div>
<b class="line"></b>
<div class="center">
    <div class="col-main">
        <div class="main-wrap">

            <div class="user-info">
                <!--标题 -->
                <div class="am-cf am-padding">
                    <div class="am-fl am-cf"><strong class="am-text-danger am-text-lg">个人资料</strong> /
                        <small>Personal&nbsp;information</small>
                    </div>
                </div>
                <hr/>

                <!--头像 -->
                <div class="user-infoPic" style="height: 250px">
                    <div class="filePic">
                        <form id="editPic" method="post" enctype="multipart/form-data">
                            <input type="file" class="inputPic" id="upLoad" allowexts="gif,jpeg,jpg,png,bmp"
                                   onchange="submitPic(this)" onclick="submitPic(this)">
                            <span th:if="${teacher.teacherPic} eq null and ${teacher.teacherPic} eq ''">
                                    <img class="am-circle am-img-thumbnail" src="/static/yonghu/images/getAvatar.do.jpg"
                                         alt=""/>
                            </span>
                            <img class="am-circle am-img-thumbnail" th:src="${teacher.teacherPic}"
                                 alt=""/>
                        </form>
                    </div>
                    <p class="am-form-help">头像</p>

                    <div class="info-m">
                        <div><b>真实姓名：<i th:text="${teacher.teacherName}">小叮当</i></b></div>
                        <div><b>手机号码：<i th:text="${teacher.teacherPhone}"></i></b>&nbsp;&nbsp;<a href="/user/toChangePhoneNumber"
                                                                                                 style="color: #0a6999">修改</a>
                        </div>
                        <div><b>电子邮箱：<i th:text="${teacher.teacherEmail}"></i></b></div>
                        <div><b>昵称：<i th:text="${teacher.teacherNicheng}">小叮当</i></b></div>
                        <div><b>性别：<i th:text="${teacher.teacherSex}">小叮当</i></b></div>
                        <div><b>个人描述：<i th:text="${teacher.teacherIntroduction}">小叮当</i></b></div>
                        <div><b>账户余额：<i th:text="${teacher.teacherMoney}">小叮当</i></b></div>
                        <div><a href="/user/forgetpwd" style="color: #0a6999">修改密码</a></div>
                    </div>
                </div>

                <form class="am-form am-form-horizontal" id="editForm">
                    <!--个人信息 -->
                    <div class="info-main">
                        <div class="am-form-group">
                            <label for="user-name2" class="am-form-label">昵称</label>
                            <div class="am-form-content">
                                <input type="text" name="teacherNicheng" placeholder="昵称">

                            </div>
                        </div>

                        <div class="am-form-group">
                            <label class="am-form-label">自我简介</label>
                            <div class="am-form-content">
                                <input placeholder="Personal description" type="text" name="teacherIntroduction">
                            </div>
                        </div>
                        <!--<div class="am-form-group">
                            <label for="user-email" class="am-form-label">手机号</label>
                            <div class="am-form-content">
                                <input id="user-email" placeholder="Email" type="email">
                            </div>
                        </div>-->
                        <div class="info-btn">
                            <div class="am-btn am-btn-danger" onclick="editMessage()">保存修改</div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <aside class="menu">
        <ul>
            <li class="person">
                <a th:href="@{/toKeCheng}">我的课程</a>
            </li>
            <li class="person">
                <a th:href="@{/toInfo}">个人资料</a>
            </li>
            <li class="person">
                <a th:href="@{/toShouRu}">我的收益明细</a>
            </li>
            <li class="person">
                <a  href="javascript:void (0)" id="money">我的钱包</a>
            </li>
        </ul>
    </aside>
</div>
</body>
<script th:src="@{/static/lib/vue.min.js}"></script>
<script th:inline="javascript">
    /*修改教师基本信息*/
    function editMessage() {
        $.ajax({
            url: "/editMsg",
            dataType: "json",
            type: "post",
            data: $("#editForm").serialize(),
            success: function (data) {
                location.replace(location.href)
            }
        })
    }

    function submitPic(obj) {
        var formData = new FormData();
        var name = $(obj).val();
        var file = $(obj)[0].files[0];
        formData.append("file", file);
        formData.append("name", name);
        $.ajax({
            url: "/editPic",
            type: "post",
            dataType: "json",
            processData: false,
            contentType: false,
            data: formData,
            success: function (data) {
                location.replace(location.href)
            }
        })
    }

   $("#money").click(function () {
        layer.open({
            type: 2,
            title: '我的钱包',
            fix: false,
            maxmin: true,
            shadeClose: true,
            area: ['1000px', '600px'],
            content: '/toWallet?id='+[[${session.teacher.teacherId}]]
        });
    })
</script>

</html>